import { fileURLToPath, URL } from 'url'
import { defineConfig } from 'vite'
import { viteMockServe } from 'vite-plugin-mock'
import vue from '@vitejs/plugin-vue'
import vueJsx from '@vitejs/plugin-vue-jsx'
import themePreprocessorPlugin from '@zougt/vite-plugin-theme-preprocessor'
import { resolve } from 'path'

// https://vitejs.dev/config/
export default defineConfig({
  css: {
    preprocessorOptions: {
      less: {
        javascriptEnabled: true
      }
    }
  },
  optimizeDeps: {
    //【注意】 排除 import { toggleTheme } from "@zougt/vite-plugin-theme-preprocessor/dist/browser-utils"; 在vite的缓存依赖
    exclude: ['@zougt/vite-plugin-theme-preprocessor/dist/browser-utils']
  },
  plugins: [
    vue(),
    vueJsx(),
    // Components({
    //   // 配置按需加载
    //   resolvers: [AntDesignVueResolver({ importStyle: "less" })],
    // }),
    viteMockServe({
      supportTs: false,
      logger: false,
      mockPath: './mock/'
    }),
    themePreprocessorPlugin({
      // 使用Less
      less: {
        // 此处配置自己的主题文件
        multipleScopeVars: [
          {
            scopeName: 'theme-light',
            path: resolve(__dirname, 'src/assets/style/theme/light.less')
          },
          {
            scopeName: 'theme-dark',
            path: resolve(__dirname, 'src/assets/style/theme/dark.less')
          }
        ],
        defaultScopeName: 'theme-light', // 默认取 multipleScopeVars[0].scopeName
        extract: false // 在生产模式是否抽取独立的主题css文件
      }
    })
  ],
  resolve: {
    alias: {
      '@': fileURLToPath(new URL('./src', import.meta.url))
    }
  }
})
